<template>
	<view class="container">
		<!-- 地图区域 - 占页面40% -->
		<view class="map-container">
			<map id="myMap" class="map" :latitude="latitude" :longitude="longitude" :markers="markers"
				:show-location="true" @markertap="onMarkerTap" @regionchange="onRegionchange">
				<!-- 搜索框 -->
				<view style="top: 0; left: 0; position: absolute; z-index: 100; width: 100%;">
					<u-navbar :borderBottom="false" :placeholder="true" :background="{background: 'rgba(0,0,0,0)'}"
						:isBack="false">
					</u-navbar>
					<view
						style="font-family: Alimama ShuHeiTi, Alimama ShuHeiTi; padding: 0rpx 32rpx 20rpx 32rpx; font-size: 40rpx; font-weight: bold;">
						人力滴滴
					</view>
					<view class="search-container"
						style="width: 686rpx; border-radius: 15px;margin: auto; padding-left: 24rpx;">
						<!-- :map="{text:'shortname', value:'id'}" -->
						<uni-data-picker
							v-slot:default="{data, error}" v-model="selectedRegion" :localdata="regions"
							popup-title="请选择城市" @nodeclick="onRegionNodeClick" @change="onSelectedRegionChange">
							<view v-if="error">
								<text>！</text>
								<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#666"></u-icon>
							</view>
							<view v-else-if="data.length" class="selected">
								<!-- <view v-for="(item, index) in data" :key="index" class="selected-item"> -->
								<text>{{data[1].text}}</text>
								<u-icon style="margin-left: 8rpx;" size="20" name="arrow-down-fill"
									color="#666"></u-icon>
								<!-- </view> -->
							</view>
							<view v-else>
								<text>请选择</text>
								<u-icon style="margin-left: 8rpx;" size="20" name="arrow-down-fill"
									color="#666"></u-icon>
							</view>
						</uni-data-picker>
						<view class="search-line1" style="margin-left: 20rpx; margin-right: 20rpx;"></view>
						<view @click="toSelService">
							<text>{{selectService?selectService.name:'全部'}}</text>
							<u-icon style="margin-left: 8rpx;" size="20" name="arrow-down-fill"
								color="#666"></u-icon>
						</view>
						<view class="search-line1" style="margin-left: 20rpx;"></view>
						<input placeholder="搜索多种服务" v-model="searchVal" @input="changeSearch" />
						<image style="width: 40rpx; height: 40rpx; margin-right: 20rpx;"
							src="/static/home/home-search@2x.png">
						</image>

					</view>
				</view>
			</map>
		</view>

		<!-- 图片魔方区域 -->
		<view class="image-cube-container"
			style="margin-top: -80rpx; width: 100%; background: linear-gradient(to bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,1) 100%);">
			<view class="image-cube-wrapper">
				<!-- 左侧图片 -->
				<view class="image-item left-image" @click="onImageClick(0)">
					<image class="cube-image" :src="images[0].url" mode="aspectFill"></image>
				</view>
				<!-- 中间凸出图片 -->
				<view class="image-item left-image" @click="onImageClick(1)">
					<image class="cube-image" :src="images[1].url" mode="aspectFill" style="width: 100%;height: 100%;">
					</image>
				</view>
				<!-- 右侧图片 -->
				<view class="image-item left-image" @click="onImageClick(2)">
					<image class="cube-image" :src="images[2].url" mode="aspectFill"></image>
				</view>
			</view>
		</view>





		<view style="width: 100vw; background: white;">

			<!-- 商城公告 -->
			<view
				style="width: 686rpx; margin-left: 32rpx; padding: 25rpx 24rpx; box-sizing: border-box; background: #F5F5F5; margin-top: 32rpx; border-radius: 24rpx; display: flex; flex-direction: row; align-items: center;">
				<image :src="noticeImg" style="margin-left: 14rpx; width: 120rpx; height: 24rpx;"></image>
				<view style="margin-left: 24rpx; background-color: #cacaca; width: 2rpx; height: 32rpx;"></view>
				<text style="margin-left: 16rpx; flex: 1; font-size: 26rpx;">系统公告</text>

			</view>

			<!-- 第一张广告 -->
			<view class="ad-container"
				style="font-size: 0px; width: 100vw; margin-top: 32rpx; padding: 0rpx 32rpx; box-sizing: border-box;">
				<image :src="oneImg" mode="widthFix" style="width: 100%;"></image>
			</view>

			<!-- 服务分类 -->
			<view style="padding: 16rpx 32rpx 30rpx 32rpx;">
				<view style="display: flex;flex-wrap: wrap;">
					<view style="width: 20%;box-sizing: border-box;" @click="toGoldMenu(item.url)"
						v-for=" (item,index) in bannerArr" :key="index">
						<view style="text-align: center;margin-top: 24rpx; font-size: 0px;">
							<image mode="aspectFill" style="background: rgb(230, 230, 230); width: 72rpx;height: 72rpx;">
							</image>
							<view style="color: #333333;font-size: 28rpx; line-height: 44rpx; margin-top: 8rpx;">{{item.title}}</view>
						</view>
					</view>
				</view>
			</view>
			<view
				style="font-size: 0px; width: 100vw; height: 24rpx; background: #F5F5F5;">
			</view>

            <!-- 最近订单 -->
			<view style="padding: 24rpx 32rpx; 8rpx 24rpx" v-if="firstOrderShow">
				<view 
					style="padding-bottom: 24rpx;border: #0BB1EF solid 1px;border-radius: 24rpx;background: #fff;">
					<view class="" style="display: flex;align-items: baseline; padding: 18rpx 24rpx;background: #0BB1EF;
				border-radius: 24rpx 24rpx 0 0;">
						<view style="flex: 1; color: #FFFFFF; font-size: 30rpx;">
							<u-icon name="bell-fill" color="#FFFFFF" size="32"></u-icon>
							<text style="padding-left: 12rpx;">最近接单</text></text>
							<!-- <text style="padding-left: 12rpx;" v-if="remaining_transaction_time > 0 && (firstOrder.firstOrder.order_status == 0 || firstOrder.firstOrder.order_status == 13)">待支付：  <text style="color: #FFF;" v-if="remaining_transaction_time > 0 && (firstOrder.firstOrder.order_status == 0 || firstOrder.firstOrder.order_status == 13)">{{ hour }}:{{ minutes }}:{{ seconds }}</text></text> -->
						</view>
						<button style="font-size: 24rpx;" @click="toDetail(firstOrder.id)">
							查看订单
						</button>
					</view>
					<view class="" style="margin-top: 26rpx;padding: 0 24rpx;display: flex;align-items: center;
				border-bottom: 1px solid #F5F5F5;padding-bottom: 22rpx;">
						<view class="order-operation-item">
							<view style="display: flex;flex-direction: row; align-items: center;"
								@click="jumpTo('/pages/users/OrderTabbar?selectedId=3')">
								<image style="width:72rpx; height: 72rpx;" src="@/static/my/yqtg.png" />
								<view style="margin-left: 12rpx;font-size: 24rpx;">
									<view style="font-size: 32rpx;font-weight: bold;">2</view>
									<view style="color: #999999;">待服务</view>
								</view>
							</view>
						</view>
						<view class="" style="flex: 1;display: flex;justify-content: center;">
							<view style="display: flex;flex-direction: row; align-items: center;"
								@click="jumpTo('/pages/users/OrderTabbar?selectedId=1')">
								<image style="width:72rpx; height: 72rpx;" src="@/static/my/yqtg.png" />
								<view style="margin-left: 12rpx;font-size: 24rpx;">
									<view style="font-size: 32rpx;font-weight: bold;">1</view>
									<view style="color: #999999;">服务中</view>
								</view>
							</view>
						</view>
						<view class="order-operation-item">
							<view style="display: flex;flex-direction: row; align-items: center;"
								@click="jumpTo('/pages/users/OrderTabbar?selectedId=2')">
								<image style="width:72rpx; height: 72rpx;" src="@/static/my/yqtg.png" />
								<view style="margin-left: 12rpx;font-size: 24rpx;">
									<view style="font-size: 32rpx;font-weight: bold;">3</view>
									<view style="color: #999999;">退款/售后</view>
								</view>
							</view>
						</view>
					</view>
					<view style="margin-top: 20rpx;display: flex;justify-content: space-between;padding: 0 24rpx;">
						<view>
							<text style="color: #999; font-size: 24rpx;">金额</text>
							<text
								style="color: #111111; font-size: 36rpx;font-weight: bold;">￥{{firstOrder.total_price}}</text>
							<!-- <text style="color: #000; font-size: 24rpx; flex:1;font-weight: bold;">05</text> -->
						</view>
						<text style="color: #FC7404; font-size: 28rpx; font-weight: bold;">
							待服务
						</text>
					</view>
					<view style="display: flex; flex-direction: row; padding: 10rpx 24rpx; margin: 10rpx 0;"
						@click="toDetail(firstOrder.firstOrder.id)">
						<view style="border-radius: 16rpx;margin-right: 16rpx;">
							<image style="width: 132rpx; height: 132rpx;border-radius: 12rpx;"
								src="../../static/logo.png">
							</image>
						</view>
						<view style="display:flex;flex-direction: column; justify-content: center;">
							<view style="display: flex;flex-direction: row;align-items: center;">
								<view style="width:16rpx;height:16rpx;border-radius:50%;background-color: #111111;">
								</view>
								<view style="margin-left: 24rpx;font-size: 28rpx;font-weight: bold;color: #333333;">
									111111
								</view>
							</view>
							<view style="display: flex;flex-direction: row;align-items: center; margin-top: 8rpx;">
								<view style="width:16rpx;height:16rpx;border-radius:50%;background-color:#0BB1EF;">
								</view>
								<view style="margin-left: 24rpx;display: flex;flex-direction:column;font-weight: bold;">
									<text style="font-size: 28rpx; overflow: hidden; color: #333333;
							  text-overflow: ellipsis; white-space: nowrap; width: 440rpx;">
										{{firstOrder.location_detail}}
									</text>
									<view style="display: flex;flex-direction: row; font-size: 24rpx;">
										<text style="color: #666666; margin-right: 24rpx;">
											{{firstOrder.nickname}}
										</text>
										<text style="color: #999999;">
											{{firstOrder.mobile}}
										</text>
									</view>
								</view>
							</view>
						</view>
					</view>
					<view style="display: flex;flex-direction: row; padding: 10rpx 24rpx;">
						<view style="flex: 1;"></view>
						<view class="hollowcss" @click="cancelOrder(firstOrder)">取消订单</view>
						<view class="solidcss" v-if="firstOrder.order_status == 1" @click="accelerateShow = true">加速接单
						</view>
					</view>
				</view>
			</view>
			
			<!-- 订单下的广告位 -->
			<view
				style="width: 100vw; padding: 0 32rpx 24rpx 32rpx;" v-if="indexAdNewList && indexAdNewList.length > 0">
				<view v-for="(item,index) in indexAdNewList" :key="index" style="width: 686rpx; margin-top: 24rpx; font-size: 0px;"
					@click="jumpTo(item.url)">
					<image :src="item.img" style="width: 100%;" mode="widthFix"></image>
				</view>
			</view>
			
			<view
				style="font-size: 0px; width: 100vw; height: 24rpx; background: #F5F5F5;">
			</view>

			<!-- 框架广告 -->
			<view style="padding: 0rpx 30rpx 28rpx 30rpx;">
				<view v-for="(item, index) in moduleAds" :key="index" style="margin-top: 32rpx;" v-if="recCurrent != 3">
					<view :style="{ backgroundImage: 'url(' + item.bg + ')' }"
						style="background-size: 100% 100%;padding: 80rpx 0rpx 24rpx 0rpx;height: 400rpx;">
						<view style="display: flex;width: 690rpx;justify-content: space-between;">
							<view v-for="(ites, inds) in item.goodsData" :key="ites.id">
								<view v-if="item.goodsData.length == 1"
									style="border: solid 1px #CCCCCC;border-radius: 8rpx;width: 690rpx"
									@click="jumpAd(ites.id)">
									<view>
										<image :src="ites.goods_image" style="width: 100%;height: 200rpx;"></image>
									</view>
									<view style="padding: 8rpx 16rpx;">
										<view style="font-size: 28rpx;font-weight: bold;">{{ites.goods_name}}</view>
										<view style="margin-top: 8rpx;">
											<text
												style="font-size: 28rpx;font-weight: bold;color: #FF2424;">￥{{ites.price}}</text>
											<text
												style="font-size: 20rpx;color: #999999;padding-left: 4rpx;">￥{{ites.underlined_price}}</text>
										</view>
									</view>
								</view>
								<view v-if="item.goodsData.length == 2"
									style="border: solid 1px #CCCCCC;border-radius: 8rpx;width: 330rpx;"
									@click="jumpAd(ites.id)">
									<view>
										<image :src="ites.goods_image" style="width: 100%;height: 200rpx;"></image>
									</view>
									<view style="padding: 8rpx 8rpx;">
										<view style="font-size: 28rpx;font-weight: bold;white-space: nowrap;
									overflow: hidden;text-overflow: ellipsis;width: 200rpx;">{{ites.goods_name}}</view>
										<view style="margin-top: 8rpx;">
											<text
												style="font-size: 28rpx;font-weight: bold;color: #FF2424;">￥{{ites.price}}</text>
										</view>
									</view>
								</view>
								<view v-if="item.goodsData.length == 3"
									style="border: solid 1px #CCCCCC;border-radius: 8rpx;width: 210rpx;"
									@click="jumpAd(ites.id)">
									<view>
										<image :src="ites.goods_image" style="height: 200rpx; width: 100%;"></image>
									</view>
									<view style="padding: 8rpx 8rpx;">
										<view
											style="font-size: 28rpx;font-weight: bold;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 150rpx;">
											{{ites.goods_name}}
										</view>
										<view style="margin-top: 8rpx;">
											<text
												style="font-size: 28rpx;font-weight: bold;color: #FF2424;">￥{{ites.price}}</text>
										</view>
									</view>
								</view>

							</view>
						</view>
					</view>
					<view style="margin-top: 24rpx;">
						<image :src="item.thumbimage" mode="widthFix" style="width: 100%;"></image>
					</view>
				</view>

				
				<view
					style="margin-top: 15rpx;display: flex;flex-wrap: wrap;margin:0 15px; justify-content:space-between;"
					v-if="recCurrent == 3">
					<view style="width: 300rpx;margin-bottom: 20rpx;" v-for="(item, index) in moduleAds" :key="index">
						<view style="border: solid 1px #CCCCCC;border-radius: 8rpx;" @click="jumpBM(item.id)">
							<view>
								<image :src="item.business_image" style="width: 100%;height: 200rpx;"></image>
							</view>
							<view style="padding: 8rpx 8rpx;">
								<view v-if="item.iszr == 1"
									style="font-size: 28rpx;font-weight: bold;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 200rpx;color: #0BB1EF;display: flex;align-items: center;">
									{{item.business_name}}
									<image :src="imgUrl + '/lvrenzheng.png'" style="width: 30rpx;" mode="widthFix">
									</image>
								</view>
								<view
									style="font-size: 28rpx;font-weight: bold;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 200rpx;">
									{{item.business_name}}
								</view>
								<view style="margin-top: 8rpx;">
								</view>
							</view>
						</view>
					</view>
				</view>

			</view>


			<!-- 新闻列表 -->
			<view style="padding-left: 17rpx; padding-top: 0;padding-bottom: 0px; border-bottom: 1px solid #F5F5F5;">
				<u-tabs :list="newList" :bar-style="{background: '#0BB1EF'}" bar-width="48" active-color="#111111" inactive-color="#999999" :current="newCurrent" @change="newChange" bg-color="none"></u-tabs>
			</view>
			<view>
				<view v-for="(item, index) in newsList" :key="index" style="padding: 24rpx 32rpx 8rpx 32rpx">
					<view style="display: flex;align-items: center;">
						<view class="u-flex-col" style="height: 168rpx; justify-content: space-between;">
							<view style="font-size: 28rpx;color:#333;margin-right: 16px; font-weight: 600;">
								夏天不能光脚丫、不能吃冰激凌？别用养生折腾孩子了
							</view>
							<view style="color: #999999; font-size: 24rpx; font-weight: 500;">5分钟前</view>
							<!-- <view style="display: flex;align-items: center;margin-top: 10rpx;">
								<image src="@/static/logo.png" mode="aspectFill"
									style="width: 24px;height: 24px;border-radius: 50%;margin-right: 10px;"></image>
								<view style="font-size: 12px;color: #333;">
									<text style="font-weight: bold;padding-right: 10px;">张清北</text>
									<text>副主任医师</text>
								</view>
							</view> -->
						</view>
						<image :src="branchMain" mode="aspectFill"
							style="width: 236rpx;height: 168rpx;border-radius: 8rpx;">
						</image>
					</view>
					<!-- <view style="font-size: 24rpx;color: #333;">
					<text style="color: #999;">99收藏</text>
					<text style="padding: 0 10px;color: #999;">66点赞</text>
					<text style="color: #999;">33评论</text>
				</view> -->
				</view>
			</view>

			<!-- 加载更多提示 -->
			<view class="load-more" v-if="loading">
				<text>数据正在加载中...</text>
			</view>
			<view class="load-more" v-if="noMore">
				<text>没有更多了</text>
			</view>
			<view style="height: 160rpx;"></view>
		</view>


		

		<!-- 每日推荐弹窗 -->
		<!-- <uni-popup ref="frmRecommend" type="center" :animation="false" style="z-index: 999;">
			<cover-view style="display: flex; flex-direction: column; width: 80vw; justify-content: center; align-items: center;">
			<cover-image :src="reminderImg" mode="aspectFit"></cover-image>
			<cover-view style="background-color: #01d47a; border-radius: 50rpx; font-size: 28rpx; color: #FFF; width: 70vw; padding: 20rpx 0rpx; margin-top: -100rpx; text-align: center;" 
			@click.stop="toBranches">前往网点</cover-view>
			<cover-image :src="btnReminderClose" style="width: 80rpx; height: 80rpx; margin-top: 100rpx;" @click.stop="closeRecommend"></cover-image>
			</cover-view>
		</uni-popup> -->

		<!-- 加速弹窗 -->
		<u-popup v-model="accelerateShow" mode="bottom" border-radius="24">
			<view style="">
				<view style="position: absolute;top: 24rpx;right: 32rpx;font-size: 32rpx;
				color: #333333;padding: 0 32rpx;" @click="accelerateShow = false">取消</view>
				<view style="margin-top: 32rpx;text-align: center;">
					<view style="font-size: 32rpx;font-weight: bold;">加速接单</view>
				</view>
				<view style="margin-top: 48rpx;background: rgba(252, 116, 4, 0.12);padding: 24rpx 32rpx;
				font-size: 32rpx;color: #FC7404;">
					订单高峰期、偏远地区、急单等情况下，选择加速师傅接单功能，可提升接单时效90%
				</view>

				<view style="padding: 0 32rpx;font-size: 28rpx;">
					<view style="color: #666666;margin-top: 28rpx;">
						平台正在为您火速匹配师傅，请稍作等待！如果您非常着急，可以试试加价包，师傅可能更快接单噢~
					</view>
					<view class="accelerate-info" v-for="(item,index) in accelerateInfo" :key="index">
						<view style="display: flex;align-items: center;">
							<view class="reduce-increase" style="font-size: 50rpx;border-radius: 4rpx 0 0 4rpx;"
								@tap="sub(item.money,item.increase,index)">-</view>
							<view class="money">￥{{ item.amount }}</view>
							<view class="reduce-increase" style="font-size: 40rpx;border-radius: 0 4rpx 4rpx 0;"
								@tap="add(item.money,item.increase,index)">+</view>
						</view>
						<view style="color: #999999;">接单可能性增加{{ item.amount_increase }}%</view>
					</view>

					<view class="accelerate-info">
						<view style="display: flex;align-items: center;">
							<view style="flex: 1;">
								<text>总价：￥{{accelerateValue}}</text>
							</view>
						</view>
						<view style="color: #999999;">接单可能性增加{{totalIncrease}}%</view>
					</view>

					<view class="confirm" @click="acceleratePay(firstOrder.id)">确认</view>
				</view>

			</view>
		</u-popup>

		<!-- <u-tabbar v-model="current" :list="list" :mid-button="true"></u-tabbar> -->
		<u-tabbar v-model="current" :list="tabbar" active-color="#0daff0" :mid-button="true"></u-tabbar>
	</view>
</template>

<script>
	import {
		getTabbarConfig
	} from '@/common/tabbar';
	import configApi from 'utils/config.js'
	import {
		homeBanner
	} from '@/utils/data';
	import {
		request
	} from 'utils/request.js'
	export default {
		data() {
			return {

				branchMain: configApi.appurlImg + '/app/icon/branchMain.jpeg',

				current: 0,
				tabbar: getTabbarConfig(true),
				
				selectService:undefined,//服务

				selectedRegion: "",
				regions: [{
						text: "广西壮族自治区",
						value: "1-0",
						children: [{
								text: "南宁市",
								value: "1-1"
							},
							{
								text: "桂林市",
								value: "1-2"
							}
						]
					},
					{
						text: "江西省",
						value: "2-0",
						children: [{
							text: "上饶市",
							value: "2-1"
						}]
					},
				],
				latitude: 39.90469,
				longitude: 116.40717,
				markers: [], // 地图标记点
				mapContext: null, // 地图上下文
				isMapMoving: false, // 地图是否正在移动
				nearbyPoints: [], // 附近点位列表
				isLoading: false, // 是否正在加载
				regionChangeTimer: null, // 区域变化计时器

				images: [{
						url: configApi.appurlImg + '/app/lingongtab.png',
						title: '美食推荐',
						id: 0
					},
					{
						url: configApi.appurlImg + '/app/weixiutab.png',
						title: '景点攻略',
						id: 1
					},
					{
						url: configApi.appurlImg + '/app/qingxitab.png',
						title: '酒店预订',
						id: 2
					}
				],
				bannerArr: homeBanner,
				noticeImg: configApi.appurlImg + '/app/gonggao.png',
				oneImg: configApi.appurlImg + '/app/ggw.png',

				// 入驻
				indexAdNewList: [{
						img: configApi.appurlImg + '/app/need.png',
						url: "/pages/master/publicize"
					},
					{
						img: configApi.appurlImg + '/app/shop.png',
						url: "/pages/merchant/publicize"
					},
				],
				// 推荐
				recList: [{
					name: '推荐'
				}, {
					name: '附近'
				}, {
					name: '最新'
				}, {
					name: '服务商'
				}],
				recCurrent: 0,

				// 框架类型
				moduleAds: [],

				// 新闻
				newList: [{
					name: '居家经验'
				}, {
					name: '生活真相'
				}, {
					name: '生活好物'
				}, {
					name: '装修课堂'
				}],
				newCurrent: 0,
				newsList: [], // 资讯列表
				page: 1, // 当前页码
				pageSize: 10, // 每页条数
				loading: false, // 是否正在加载
				noMore: false, // 是否没有更多数据

				firstOrderShow: true,
				firstOrder: {},
				accelerateShow: false,
				accelerateInfo: [],
				accelerateValue: 0,
				totalIncrease: 0,
			}
		},
		onLoad(options) {
			// 获取地图上下文
			this.$nextTick(() => {
				this.mapContext = uni.createMapContext('myMap', this)
			})

			// 刷新页面
			uni.$on('htmlRefresh', (options) => {
				console.log('子页面---->>>>>>', options);
				// 获取最近的一个未接单订单
				this.orderOne();
			})

			this.initMap(); // 获取地图
			this.loadNews(); // 获取新闻
			this.userInfoData(); // 获取用户登录/最后一次订单
			this.getBaseHome(); // 获取首页信息
			// this.initMarkers();
			// uni.setStorageSync('userToken', 'ea78976d6d2168445792bb21ea1a6702');
			// this.jiekou();
		},
		onReachBottom() {
			this.loadNews(); // 上拉加载更多
		},
		methods: {
			// 获取首页信息
			getBaseHome() {
				request.get({
					url: '/baseconfig/baseHome',
					data: {
						type: this.recCurrent
					}
				}).then(res => {
					console.log('获取首页信息：', res);
					this.moduleAds = res.data.moduleAds;
				})
			},
			userInfoData() {
				if (!uni.getStorageSync('userToken')) return
				// console.log('接口请求：-------')
				request.getWithToken({
					url: '/user/userInfo'
				}).then(res => {
					// console.log('userInfo：', res);
					if (res.data.user) {
						this.orderOne();
					}
				})
			},
			orderOne() {
				request.getWithToken({
					url: '/order/getOrderOne'
				}).then(res => {
					// console.log('getOrderOne：', res);
					this.firstOrder = res.data.orderData;
					if (this.firstOrder) {
						console.log('显示最新一条数据')
						this.firstOrderShow = true;
					}
					this.accelerateInfo = res.data.accelerateData;
				})
			},
			// 加价包减
			sub(money, increase, i) {
				if (this.accelerateInfo[i].amount == 0) {
					return
				}
				let total_accelerateValue = this.accelerateValue;
				total_accelerateValue -= money
				if (total_accelerateValue <= 0) {
					this.accelerateValue = 0
					this.totalIncrease = 0
				} else {
					this.accelerateValue -= money
				}

				let total_increase = this.totalIncrease;
				total_increase -= increase
				if (total_increase <= 0) {
					this.totalIncrease = 0;
				} else {
					this.totalIncrease -= increase
				}

				if (this.accelerateInfo[i].amount >= money) {
					this.accelerateInfo[i].amount -= money
					this.accelerateInfo[i].amount_increase -= increase
				}
			},
			// 加价包加
			add(money, increase, i) {
				this.accelerateValue += money
				this.totalIncrease += increase
				// if(this.shadowStorageIncrease >= 99 ) {
				// 	this.totalIncrease = 99
				// } else {
				// 	this.totalIncrease += increase
				// }
				// if(this.accelerateInfo[i].amount > money){
				this.accelerateInfo[i].amount += money
				this.accelerateInfo[i].amount_increase += increase
				// }
			},
			acceleratePay(order_id) {
				console.log(order_id);
				// console.log('firstOrder: ', this.firstOrder);
				console.log('accelerateValue: ', this.accelerateValue);
				if (this.accelerateValue > 0) {
					this.accelerateShow = false;
					uni.navigateTo({
						url: '/pages/pay/paymentAccelerate?order_id=' + order_id + '&accelerateValue=' + this
							.accelerateValue
					})
				} else {
					uni.showToast({
						title: '请增加加速金额',
						duration: 2000,
						icon: 'none'
					});
				}

			},
			recChange(index) {
				this.recCurrent = index;
				this.getBaseHome();
			},
			newChange(index) {
				this.newCurrent = index;
			},
			// 加载资讯列表
			loadNews() {
				if (this.loading || this.noMore) return;
				this.loading = true;

				// 模拟接口请求
				setTimeout(() => {
					const newData = Array.from({
						length: this.pageSize
					}, (_, i) => ({
						id: this.newsList.length + i + 1,
						title: `资讯标题 ${this.newsList.length + i + 1}`,
						desc: `这是资讯的描述内容 ${this.newsList.length + i + 1}`,
						image: `https://via.placeholder.com/150x100?text=News${this.newsList.length + i + 1}`
					}));

					this.newsList = [...this.newsList, ...newData];
					this.loading = false;

					// 模拟没有更多数据
					if (this.page >= 3) {
						this.noMore = true;
					} else {
						this.page++;
					}
				}, 1000);
			},
			jiekou() {
				// request.post({
				// 	url: '/api/master/login',
				// 	data: {
				// 		username: '18977165805',
				// 		password: '123456'
				// 	}
				// }).then(res=>{
				// 	console.log('返回用户信息：', res);
				// })

				request.getWithToken({
					url: '/api/demo/test'
				}).then(res => {
					console.log('返回用户信息：', res);

				})
				return;


				request.getWithToken({
					url: '/master.master/info'
				}).then(res => {
					console.log('返回用户信息：', res);

				})

				return;
				request.post({
					url: '/master.master/appLogin',
					data: {
						username: '18977165805',
						password: '123456'
					}
				}).then(res => {
					console.log('返回用户信息：', res);
				})
				// request.postWithToken({
				// 	url: '/user/third'
				// }).then(res=>{
				// 	console.log('返回用户信息：', res);
				// 	if(res.code == 1){
				// 		this.userinfo = res.data.user;
				// 		if(res.data.user){
				// 			this.isLogin = true;
				// 		}else{
				// 			this.isLogin = false;
				// 		}
				// 	}
				// })
			},
			initMap() {
				uni.getLocation({
					type: 'gcj02',
					success: (res) => {
						console.log('经纬度: ', res);
						this.latitude = res.latitude;
						this.longitude = res.longitude;
						this.initMarkers();
					},
					fail: (err) => {
						console.log('获取位置失败:', err);
						uni.showToast({
							title: '获取位置失败，使用默认位置',
							icon: 'none'
						});
					}
				});
			},
			initMarkers() {
				request.post({
					url: '/baseconfig/nearbyMaster',
					data: {
						latitude: this.latitude,
						longitude: this.longitude
					}
				}).then(res => {
					console.log('返回附近师傅信息：', res);
					this.markers = [...res.data.masterList];
				})
				// // 附近的师傅标记（2-3个）
				// const masterMarkers = [{
				// 		id: 2,
				// 		latitude: this.latitude + 0.01,
				// 		longitude: this.longitude + 0.01,
				// 		iconPath: '/static/icon/master.png',
				// 		width: 25,
				// 		height: 25,
				// 		title: '张师傅（5.0分）',
				// 		callout: {
				// 			content: '张师傅\n5.0分\n距离您1.2km',
				// 			color: '#333',
				// 			fontSize: 12,
				// 			borderRadius: 5,
				// 			bgColor: '#fff',
				// 			padding: 5,
				// 			display: 'ALWAYS'
				// 		}
				// 	},
				// 	{
				// 		id: 3,
				// 		latitude: this.latitude - 0.01,
				// 		longitude: this.longitude - 0.01,
				// 		iconPath: '/static/icon/master.png',
				// 		width: 25,
				// 		height: 25,
				// 		title: '李师傅（4.8分）',
				// 		callout: {
				// 			content: '李师傅\n4.8分\n距离您0.8km',
				// 			color: '#333',
				// 			fontSize: 12,
				// 			borderRadius: 5,
				// 			bgColor: '#fff',
				// 			padding: 5,
				// 			display: 'ALWAYS'
				// 		}
				// 	}
				// ];
				// this.markers = [...masterMarkers];
			},
			onMarkerTap(e) {
				const markerId = e.markerId;
				const marker = this.markers.find(m => m.id === markerId);
				if (marker) {
					uni.showToast({
						title: `点击了: ${marker.title}`,
						icon: 'none'
					});
				}
			},
			onRegionchange(e) {
				// 监听地图移动结束事件
				if (e.type === 'begin') {
					// 地图开始移动
					this.isMapMoving = true

					// 清除之前的计时器
					if (this.regionChangeTimer) {
						clearTimeout(this.regionChangeTimer)
						this.regionChangeTimer = null
					}
				} else if (e.type === 'end') {
					// 地图移动结束
					this.isMapMoving = false

					// 设置延迟执行，避免频繁触发
					this.regionChangeTimer = setTimeout(() => {
						// 获取当前地图中心点
						this.mapContext.getCenterLocation({
							success: (res) => {

								if (this.latitude != res.latitude) {
									this.latitude = res.latitude
									this.longitude = res.longitude
									console.log('获取中心点:', res)
									// 重新获取附近点位
									this.getNearbyPoints()
								}

							},
							fail: (err) => {
								console.log('获取中心点失败', err)
							}
						})
					}, 300) // 延迟300ms，确保地图完全停止
				}
			},
			// 获取附近点位数据
			getNearbyPoints() {
				this.isLoading = true
				request.post({
					url: '/baseconfig/nearbyMaster',
					data: {
						latitude: this.latitude,
						longitude: this.longitude
					}
				}).then(res => {
					console.log('返回附近师傅信息：', res);
					this.nearbyPoints = res.data.masterList;
					this.updateMarkers(res.data.masterList)
					this.isLoading = false
					// this.markers = [...res.data.masterList];
				})
			},
			// 更新地图标记
			updateMarkers(points) {
				this.markers = points.map(point => ({
					id: point.id,
					latitude: point.latitude,
					longitude: point.longitude,
					iconPath: '/static/location.png',
					width: 25,
					height: 25,
					callout: {
						content: point.title,
						color: '#333',
						fontSize: 14,
						borderRadius: 4,
						bgColor: '#fff',
						padding: 8,
						display: 'ALWAYS'
					}
				}))
			},
			jumpTo(url) {
				uni.navigateTo({
					url: url,
				});
			},
			onImageClick(index) {
				console.log('index: ', index)
				uni.showToast({
					title: `点击了: ${this.images[index].title}`,
					icon: 'none'
				});
			},
			// 跳转商品详情
			jumpAd(gid) {
				uni.navigateTo({
					url: "/pages/goods/details?goods_id=" + gid
				});
			},
			// 获取服务城市
			initRegion() {
				let self = this;
				// commonApi.getRegionList().then(res => {
				// 	console.log("rgs", res);
				// 	self.regions = res;
				// 	self.dataList();
				// 	// 	self.getRegionData();
				// });
			},
			// 切换城市
			onSelectedRegionChange(e) {
				console.log(1111, e)
				// uni.setStorageSync("lastRegionCode", this.selectedRegion);
			},
			// 切换城市
			onRegionNodeClick(e) {
				console.log(e);
				this.selectedRegion =
					console.log('this.selectedRegion:', this.selectedRegion)
				let self = this;
				// commonApi.getRegion({code: this.selectedRegion, lng: this.longitude, lat: this.latitude}).then(res => {
				// 	self.selectedRegion = res.id;
				// 	uni.setStorageSync("lastRegionCode", self.selectedRegion);
				// 	self.longitude = res.lng;
				// 	self.latitude = res.lat;
				// 	self.dataList();
				// });
			},
			toSelService(e){
				uni.navigateTo({
					url: '/pages/home/serviceItems'
				});
			}
		}
	}
</script>

<style>
	page {
		background-color: #F5F5F5 !important;
	}
</style>
<style lang="less">
	.container {
		display: flex;
		flex-direction: column;
		// height: 100vh;
		width: 100%;
	}

	/* 地图区域样式 - 占页面40% */
	.map-container {
		height: 40vh;
		width: 100%;
		// position: relative;
		// overflow: hidden;
	}

	.map {
		width: 100%;
		height: 100%;
	}

	/* 图片魔方区域样式 */
	.image-cube-container {
		/* margin-top: -40rpx; */
		padding: 20rpx 32rpx;
		box-sizing: border-box;
		position: relative;
		z-index: 10;
		/* flex: 1; */
	}

	.image-cube-wrapper {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		height: 100%;
	}

	.image-item {
		position: relative;
		border-radius: 16rpx;
		overflow: hidden;
		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
		pointer-events: auto;
	}

	.cube-image {
		width: 100%;
		height: 100%;
	}

	.image-title {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
		color: white;
		padding: 20rpx;
		font-size: 28rpx;
		text-align: center;
	}

	/* 左侧图片 */
	.left-image {
		width: 212rpx;
		height: 160rpx;
		z-index: 1;
	}


	.search-container {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		border: 1rpx solid #CCC;
		border-radius: 24rpx;
		height: 76rpx;
		
		background-color: #FFF;
		box-shadow: 0px 8rpx 12rpx 0rpx rgba(0,0,0,0.1);

		input {
			font-size: 30rpx;
			padding: 0 20rpx 0 0;
			flex: 1;
			margin-left: 20rpx;
			
		}
		text{
			font-size: 32rpx;
			font-weight: 600;
		}
		.search-line1{
			width: 1px;
			height: 32rpx;
			background: #D9D9D9;
		}
	}

</style>


<style lang="less">
	/* 列表样式 */
	.list-item {
		margin-bottom: 20rpx;
		padding: 36rpx;
		background-color: #fff;
		border-radius: 18rpx;
		box-shadow: 0 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.1);
	}

	/* 加载更多样式 */
	.load-more {
		text-align: center;
		padding: 20rpx;
		font-size: 24rpx;
		color: #999;
	}

	.solidcss {
		color: #fff;
		border: 2rpx solid #FC7404;
		background: #FC7404;
		border-radius: 10rpx;
		padding: 16rpx 0rpx;
		width: 80px;
		text-align: center;
		margin-left: 24rpx;
	}

	.hollowcss {
		color: #909399;
		border: 2rpx solid #909399;
		border-radius: 10rpx;
		padding: 16rpx 0rpx;
		width: 80px;
		text-align: center;
		margin-left: 24rpx;
	}

	.accelerate-info {
		border: solid 1px #CCCCCC;
		margin-top: 28rpx;
		padding: 24rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-radius: 24rpx;

		.reduce-increase {
			background: #F2F3F5;
			width: 68rpx;
			height: 68rpx;
			text-align: center;
			line-height: 68rpx;
		}

		.money {
			background: #E5E6EB;
			width: 144rpx;
			height: 68rpx;
			text-align: center;
			line-height: 68rpx;
		}
	}

	.confirm {
		margin-bottom: 40rpx;
		margin-top: 72rpx;
		background: #FC7404;
		border-radius: 24rpx;
		font-size: 32rpx;
		color: #fff;
		font-weight: bold;
		text-align: center;
		padding: 24rpx;
	}
</style>